<!DOCTYPE html>
<html>

	<head>
		<meta charset="utf-8" />
		<title>开会倒计时</title>
		<style type="text/css">
			.countdown-wrap {
				width: 400px;
				margin: 200px auto;
			}		
			.input {
				outline: none;
				-webkit-appearance: none;
				border-radius: 0;
			}
			
			input:focus {
				outline: none;
				border-color: #ccc;
			}
			.countdown-box  {
				margin-bottom: 10px;
			}
			.countdown-box input {
				width: 300px;
				height: 25px;
				line-height: 25px;
				padding: 5px 10px;
				border-radius: 4px;
				outline: hidden;
				border: 1px solid #ddd;
				font-size: 14px;
			}
			.fen {
				margin-left: 10px;
				color: #666;
				font-size: 16px;
			}
			#countdown-btn {
				display: block;
				width: 80px;
				height: 25px;
				line-height: 25px;
				text-align: center;
				border: 1px solid #ddd;
				border-radius: 5px;
				font-size: 13px;
				color: #666;
				background: #eee;
				cursor: pointer;
			}
		</style>
	</head>

	<body>
		<div class="countdown-wrap">
			<div class="countdown-box">
				<input type="text" id="countdown-input" value="" placeholder="请输入分钟数" /><span class="fen">分</span>
			</div>
			<a id="countdown-btn">开始倒计时</a>
		</div>
	</body>

</html>
<script type="text/javascript">
	var countdownInput = document.querySelector('#countdown-input');
	var countdownBtn = document.querySelector('#countdown-btn');
	countdownBtn.onclick = function(e) {
		var totalTime = countdownInput.value.trim();

		if(totalTime === "") {
			alert('请输入时间！');
			return;
		}

		if(!/\d+/.test(totalTime)) {
			alert('请输入数字！');
			return;
		}

		this.href = './show.html?totalTime=' + totalTime;
	}
	
	document.onkeydown = function(e) {
		console.log(e.keyCode);
		e = e || window.event;
		if((e.keyCode || e.which) == 13) {
			countdownBtn.click();
		}
	}
</script>